'use client'

import {
  AppleOutlined,
  XOutlined,
  GoogleOutlined,
  GithubOutlined,
  FacebookOutlined,
  WindowsOutlined
} from '@ant-design/icons'

export default function UserAuthStrategyIcon({
  strategy,
  className
}: {
  strategy: string
  className?: string
}) {
  const Icon = getStrategyIconComponent(strategy)

  if (!strategy) {
    return null
  }

  if (!Icon) return null
  return <Icon className={className} />
}

export const getStrategyIconComponent = (strategy: string) => {
  switch (strategy) {
    case 'from_oauth_github':
      return GithubOutlined
    case 'from_oauth_google':
      return GoogleOutlined
    case 'from_oauth_apple':
      return AppleOutlined
    case 'from_oauth_microsoft':
      return WindowsOutlined
    case 'from_oauth_facebook':
      return FacebookOutlined
    case 'from_oauth_twitter':
      return XOutlined
  }
}
